import type { GoogleElements } from '../../../../../../../../types/constants/personalization/google'
import { ThemeVarService } from '../../../../../../../../lib/abstract/style/theme_var/service'
import {
  AppStyleCollections,
  PAGE_ELEMENTS,
  PROJECT_PREFIX,
  SUPPORTED_PLATFORMS,
} from '../../../../../../../../types/constants'
import { SearchCommonStyles } from '../../common'

export class GoogleVideoPage {
  elements: GoogleElements = PAGE_ELEMENTS[SUPPORTED_PLATFORMS.GOOGLE]
  private static instance: GoogleVideoPage
  private readonly themeVarService: ThemeVarService = ThemeVarService.getInstance()
  private readonly searchCommonStyles: SearchCommonStyles = SearchCommonStyles.getInstance()

  /**
   * 获取单例实例
   */
  public static getInstance(): GoogleVideoPage {
    if (!GoogleVideoPage.instance) {
      GoogleVideoPage.instance = new GoogleVideoPage()
    }
    return GoogleVideoPage.instance
  }

  init(): void {
  }

  titleStyles(options?: { marginTop?: boolean, titleLinkLeft?: boolean }): string {
    const { marginTop = false, titleLinkLeft = true } = options || {}

    return `
      /* 去掉标题下划线 */
      a:has(> h3) {
        &:hover {
          h3 {
            text-decoration: none !important;
          }
        }
      }
      
      /* 标题*/
      h3 {
        color: var(${this.themeVarService.link.default.text}) !important;
        padding-top: 0 !important;
        ${marginTop ? 'margin-top: 16px !important;' : ''}
        
        &:hover {
          color: var(${this.themeVarService.link.default.textHover}) !important;
        }
        
        ${titleLinkLeft
          ? `
            & + div {
              left: 10px !important;
            }
          `
          : ''}
      }
    `
  }

  contentStyles(): string {
    return `
    /* 描述*/
    div[jsshadow] {
      > div > div {
        color: var(--${PROJECT_PREFIX}-theme-text-secondary) !important;
        
        b {
          color: var(${this.themeVarService.em.text}) !important;
        }
      }
      
      + div {
        span {
          color: var(${this.themeVarService.search.default.text}) !important;
        }
        
        /* 重要时刻 */
        a {
          &:hover {
            text-decoration: none !important;
          } 
        
          div {
            color: var(${this.themeVarService.search.default.text}) !important;
          }
          
          span {
            color: var(${this.themeVarService.link.default.text}) !important;
          }
        }
      }
    }
    `
  }

  /**
   * 无搜索结果样式
   */
  noSearchResult(): string {
    return ``
  }

  getMainStyles(): string {
    return `
  /* 主样式 */  
  #main {
    #rcnt {
      padding-top: ${this.themeVarService.search.resultItem.gap} !important;

      > div {
        display: block !important;
        margin: 0 !important;
      }
      
      #search {
        #rso .${AppStyleCollections.Search.class.SEARCH_TIP} {
          margin-bottom: ${this.themeVarService.search.resultItem.gap} !important;

          > div > div {
            background-color: transparent !important;
            color: var(${this.themeVarService.search.default.text}) !important;
            
            a {
              color: var(${this.themeVarService.link.default.text}) !important;
              
              &:hover {
                text-decoration: none !important;
              }
            }
          }
        }

        /* 搜索结果列表一 */
        #rso > div:has(h3) {
          ${this.searchCommonStyles.resultContainerStyles({ fullWidth: false })}
          margin-bottom: ${this.themeVarService.search.resultItem.gap} !important;
          
          /* 非结果项 */
          > span {
            display: none !important;
          }
          
          /* 结果项 */
          > div {
            ${this.searchCommonStyles.resultItemStyles({ overflowHide: false, setPadding: false, noMarginBottom: true })}
          }
          
          > div > div:not(.${AppStyleCollections.Search.class.META_CONTAINER}) {
            background-color: transparent !important;
            margin: 0 !important;
            padding: ${this.themeVarService.search.resultItem.padding} !important;
            overflow: hidden !important;
            
            div[jscontroller], > div > div {
              ${this.titleStyles()}
              ${this.contentStyles()}
            }
          }
        } 
      }

      #botstuff {
        overflow: hidden !important;

        div[data-state-token] {
          > div:has(h3) {
            /* 搜索结果列表二 */
            ${this.searchCommonStyles.resultContainerStyles()}
            margin-bottom: ${this.themeVarService.search.resultItem.gap} !important;
            
            /* 结果项 */
            > div {
              ${this.searchCommonStyles.resultItemStyles({ relativePosition: false })}
              padding-top: 0 !important;
              margin-bottom: 0 !important;
              width: auto !important;

              ${this.titleStyles({ marginTop: true, titleLinkLeft: false })}
              ${this.contentStyles()}
              
              > div {
                background-color: transparent !important;
                margin-bottom: 0 !important;
              }
            }
          }
        }
        
        /* 更多结果 */
        a[role=button][data-ve-view] {
          hr {
            background-color: transparent !important;
          }
        }
      }
    }
  }
`
  }
}
